import React, { useContext } from 'react';
import TodoItem from './TodoItem';
import TodoContext from '../../context';

const TodoList = () => {
  const { todos } = useContext(TodoContext);

  return (
    <div className="max-w-3xl mx-auto space-y-3">
      {todos.map((todo) => (
        <TodoItem key={todo.id} {...todo} />
      ))}
    </div>
  );
};

export default TodoList;
